<template>
    <div class="item" @click="handleClick(item.id)">
        <img :src="item.pic" alt="">
        <p>{{item.title}}</p>
    </div>
</template>

<script>
export default {
  props:{
      item:{
          type:Object
      }
  },
  methods: {
      handleClick(id,title){
          this.$emit("toggle",id,title)
      }
  },
}
</script>
<style scoped>
.item img{
    width:150px;
    height: 150px;
}
.item{
    width:150px;
    border:1px solid #333;
    padding:10px;
}
</style>